<!DOCTYPE HTML>
<html ng-app="base">
  <head>
    <title>orp.io URL shortener</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/static/base.css">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
    <script src="/static/base.js"></script>
  </head>
  <body ng-controller="BaseCtrl">
    <h1 id="header">&#596;&#114;&#112;&#105;&#716;&#111;&#650;</h1>
    <h2 id="subheader">URL shortener written in Go</h2>
    <div id="centerDiv">
      <form ng-submit="shortenUrl()">
        <div id="midwrapper">
          <div id="mid">
            <input id="url" type="text" ng-model="longUrl" placeholder="Type a URL here:" autocomplete="off">
            <div>
              <p class="error" ng-model="errorText" hidden-when-empty>{{`{{errorText}}`}}&nbsp;</p>
            </div>
          </div>
        </div>
        <div id="left">
          &nbsp;
        </div>
        <div id="right">
            <input type="submit" class="btn" value="&#596;rp">
        </div>
      </form>
    </div>
    <div id="result">
      <input type="text" id="short" size="21" select-on-click readonly ng-model="shortUrl">
    </div>
  </body>
</html>
